<template>
  <div id="orders" :class="styleTypeClass" :style="{width,height:'100%'}">
    <!-- 默认样式-->
    <template>
      <!--      <div class="title">-->
      <!--        <div class="d-flex pt-2 pl-2">-->
      <!--          <span class="title-icon"></span>-->
      <!--          <span class="fs-xl text mx-2">订单统计</span>-->
      <!--        </div>-->
      <!--      </div>-->
      <div class="mt-3" style="height:95%">
        <EchartsIndex :options="options"/>
      </div>
    </template>
  </div>
</template>

<script>
import mixin from '../mixin/index'
import mixinEcharts  from '../mixin/echarts'
export default {
  name: "Orders",
  mixins: [mixin,mixinEcharts],
  components: {},
  data(){
    return {
      options: {
        title: {
          text: ''
        },
        legend: {
          data: ['报事数',]
        },
        radar: {
          // shape: 'circle',
          indicator: [
            { name: '工区报修', max: 6000 },
            { name: '入户维修', max: 6000 },
            { name: '公区报事', max: 6000 },
            { name: '户内报事', max: 6000 },
            { name: '有偿服务', max: 6000 },
          ],
          splitArea: {
            areaStyle: {
              color: ['#225df6', '#26C3BE', '#64AFE9', '#428BD4'],
              shadowColor: 'rgba(0, 0, 0, 0.2)',
              shadowBlur: 10
            }
          },
        },
        series: [
          {
            name: 'Budget vs spending',
            type: 'radar',
            data: [
              {
                value: [4200, 3000, 2000, 3500, 5000, 1800],
                name: 'Allocated Budget'
              },
            ]
          }
        ]
      }
    }
  },
  props:{},
  computed:{}
}
</script>

<style lang="scss" scoped>
@import '@/styles/datav/infoPlatform.scss';
</style>
